{% extends 'base.html' %}
{% load staticfiles %}

{% block title %}商城 - 哆唻咪启蒙乐园{% endblock %}
{% block custom_head_js %}
{% endblock %}

{% block custom_content %}
    <section class="page-title center">
        <div class="container">
            <h2>STORE</h2>
            <ul>
                <li><a href="{% url 'main:index' %}">主页</a></li>
                <li><a href="#">商城</a></li>
            </ul>
        </div>
    </section>


    <section class="shop">
        {% if goods_list %}
            <div class="container">
                {#            {% if goods.len < 3 %}#}
                <div class="team-list row">
                    {% for goods in goods_list %}
                        <div class="col-md-3 col-sm-6 col-xs-12">
                            <div class="item wow fadeIn" data-wow-duration="2s" data-wow-delay="0.5s"
                                 data-wow-offset="0"
                                 style="visibility: visible; animation-duration: 1s; animation-delay: 0.5s; animation-name: fadeIn;">
                                <figure class="img-holder">
                                    <a href="/shop/goods/{{ goods.id }}"><img src="{{ goods.image_url }}"
                                                                              alt="{{ goods.name }}"></a>
                                </figure>
                                <div class="content">
                                    <h2><a href="/shop/goods/{{ goods.id }}">{{ goods.name }}</a></h2>
                                    <p>{{ goods.price }} 元</p>
                                    <div class="cart">
                                        <a href="javascript:void(0); onclick = add_cart({{ goods.id }},1)"
                                           class="add_cart" id="add_cart"><span
                                                class="flaticon-shop"></span></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    {% endfor %}
                </div>
                {#            {% endif %}#}
            </div>
        {% else %}
            <div class="link-btn center"><a href="{% url 'main:index' %} " class="theme-btn btn-style-one">商城空空如也</a>
            </div>
        {% endif %}
    </section>

{% endblock %}

{% block custom_body_js %}
    <script type='text/javascript'>
        function add_cart(gid, count) {
            if (gid && count) {
                console.log('addcat', gid, count)

                $.post('/shop/cart/add', {'sku_id': gid, 'count': count}, function (data) {
                        console.log(data)
                        if (data.res == 6) {
                            alert('添加购物车成功')
                        } else {
                            alert('添加购物车失败')
                        }
                    }, 'json'
                )
            } else {
                console.log('addcat is null')
            }
        }
    </script>
{% endblock %}